import { useHomeWorksStore } from '@/domain/correction/hooks/homeWork';
import { useImageStore } from '@/domain/correction/hooks/image';
import { AnswersID } from '@/domain/correction/types';
import { ImageInfo } from '@/domain/correction/types/jobs/images';
import { computed, defineComponent, onMounted, onUnmounted, reactive, Ref, ref, toRaw } from 'vue';

export default defineComponent({
  name: 'correctEditor',
  props: {
    visible: {
      type: Boolean,
      default: false
    },
    stu_id: {
      type: Boolean,
      default: false
    }
  },
  setup() {
    const store = useImageStore();
    const visibleIdx = computed(() => store.state.activeImageManages?.idx);
    /**加载 */
    onMounted(() => {
      /**更新图像后激活 */

      store.activateSubjectManages();
    });

    return () => (
      <>
        {store.state.images.map((node, idx) => (
          <div
            class={' w-full h-v70 absolute top-0 left-0'}
            style={{ display: visibleIdx.value === idx + 1 ? 'block' : 'none' }}
            ref={(r: any) => {
              if (r) {
                store.state.imageDomContain[(idx + 1).toString()] = { node, r, id: node.id! };
              }
            }}
          ></div>
        ))}
      </>
    );
  }
});
